<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../js/jquery-1.11.2.min.js"></script>
		<style>

		</style>
	</head>

	<body>
		<ul>
			<li class="change"><img src="../img/star2.png" /></li>
			<li class="change"><img src="../img/star2.png" /></li>
			<li class="change"><img src="../img/star2.png" /></li>
		</ul>
		<script>
			$(".change").click(function() {
				var index = $(this).index() + 1;
				console.info(index);
				var src = $(".change:nth-child(" + (index) + ") img").attr("src");
				if(src == "../img/star2.png") {
					for(var i = 0; i < index; i++) {
						$(".change:nth-child(" +(i+1)+") img").attr("src", "../img/star1.png");
					}
				} else {
					for(var i = 0; i < index; i++) {
						$(".change:nth-child(" +(i+1)+") img").attr("src", "../img/star2.png");
					};
				}

			})
		</script>
	</body>

</html>